<%@ page language="java" pageEncoding="UTF-8" contentType="text/html;charset=UTF-8"%>
<%@ include file="/common/header.jsp" %>

<!-- page specific plugin scripts -->
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="${ctx}/assets/js/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css">
    <script type="text/javascript" src="${ctx}/assets/js/ztree/js/ztree.js"></script>
    <script type="text/javascript" src="${ctx}/assets/js/ztree/js/jquery.ztree.core-3.5.js"></script> 
   
<script type="text/javascript">
var result = $.parseJSON('${childrenNodes}');
var checkType ='${checkType}';
var clickType ='${clickType}';
var zTree;
var setting = {
	data: {
		simpleData: {
			enable: true
		}
	},
	edit:{
		enable: true,
		showRemoveBtn: false,
		showRenameBtn: false,
		drag:{
			prev:true,
			inner:false,
			next:false,
			isMove:true
		}
	},
	view: {
		dblClickExpand: false
	},
	check: {
		enable: true
	},
	callback: {
		onClick: onClick,
	} ,
	async: {
		enable: true,
		url:"${ctx}/org/haveChildNodes",
		autoParam:["id","messageType","checkType"],
		type: "post",
		dataType: "json",
		dataFilter: filter
	} 
};
//异步加载子节点 	
function filter(treeId, parentNode, childNode) {
	if(childNode.length < 1) {
		zTree.removeChildNodes(parentNode);
	} else {
		return resultToNodes(childNode);
	}
}
 //左键点击选择节点
function onClick(event, treeId, treeNode, clickFlag) {
	 //alert("clickType:"+clickType);
	 //alert("treeNode.messageType:"+treeNode.messageType);
	 if((clickType =="dept" && treeNode.messageType=="dept")||(clickType =="org" && treeNode.messageType=="org")){
		 $("#returnData").val("{orgId:'" + treeNode.id + "',orgName:'"+treeNode.name+"'}");
		$("#returnData").data("context", treeNode);
	 }else{
		 return false; 
	 }
	$("#common_select_org_container").dialog("close");
}
 var orgO = "${ctx}/assets/js/ztree/css/zTreeStyle/img/diy/org.png", 
     orgC = "${ctx}/assets/js/ztree/css/zTreeStyle/img/diy/org.png", 
     org = "${ctx}/assets/js/ztree/css/zTreeStyle/img/diy/org.png";
     dept = "${ctx}/assets/js/ztree/css/zTreeStyle/img/diy/dept.png";
     
     
     //分割子节点
     function resultToNodes(result){
       	var fNodes = [];
      		$.each(result,function(i,node){
      			fNodes.push(getNodes(node,checkType));
      		});
       	return fNodes;
     }
     //设置子节点信息
       function getNodes(node,checkType){
       	var fNode = {
       		id: node.id, //节点编号
       		pId: node.pId, //父节点编号
       		name:node.text,//节点名称（在机构树上展示的名称）
       		open:node.isOpen==1?true:false, //是否打开子节点
       		messageType: node.nodeType, //节点属性（自定义），分org/dept
       		status:node.status, //状态，0-未启用 1-启用 2-停用
       		isParent: node.hasChild==1?true:false,//是否含有子节点
       		type:node.type,//机构节点专用类型 1-机构 0-部门
       		checkType: checkType,//机构树类型 分org(只展示机构)/dept(展示机构、部门)/user(展示机构、部门、人员)
       		iconOpen: orgO, //节点图标
       		iconClose: orgC,//节点图标
       		icon: org // 节点图标
       	};
       	
       	if(node.type == "item") {
      		fNode.iconOpen = dept;
      		fNode.iconClose = dept;
      		fNode.icon = dept; 
      	} 
       	
       	return fNode;
       }
      //页面加载树结构
        var scripts = [null, null];
            $('.page-content-area').ace_ajax('loadScripts', scripts, function() {
            $.fn.zTree.init($("#orgTree1"), setting, resultToNodes(result));
        	zTree = $.fn.zTree.getZTreeObj("orgTree1");
        });

        
        
    </SCRIPT>
		<!-- #section:plugins/fuelux.treeview -->
		<div class="row">
	<div class="col-xs-12">
		<!-- PAGE CONTENT BEGINS -->
	<input type="hidden" name="returnData" id="returnData" />	
		<!-- #section:plugins/fuelux.treeview -->
		<div class="row">
			<div class="col-sm-12">
				<div class="widget-box widget-color-green2">				
					<div class="widget-header">
					<h4 class="widget-title lighter smaller"><hw:orgName orgId="${rootOrgId}" /></h4>
					</div>
					<div class="widget-body">
						<div class="widget-main padding-8">
							<ul id="orgTree1" class="ztree"></ul>
						</div>
					</div>

				</div>
			</div>
		</div>
	</div><!-- /.col -->
</div>


